<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link th:href="@{/layui/css/layui.css}" rel="stylesheet"/>
    <link th:href="@{/css/tool.css}" rel="stylesheet"/>

</head>
<body>
<div class="layui-container">
    <table id="table1" lay-filter="test"></table>

</div>
</body>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="detail">查看细节</a>
    <!--    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>-->
</script>
<script src="/layui/layui.js" charset="utf-8"></script>
<script>
    layui.use(['table', 'util', 'layer'], function () {
        var table = layui.table,
            $ = layui.$,
            util = layui.util,
            layer = layui.layer;

        //第一个实例
        table.render({
            elem: '#table1'
            // , height: 312
            , url: '/languagesData' //数据接口
            //, page: true //开启分页
            , cols: [
                [ //表头
                    {type: 'numbers', title: '序号', width: 100, fixed: 'left',align: 'center'},
                    {field: 'd.classDetail.courseId', title: '课程Id', fixed: 'left',templet: "<div>{{d.classDetail.courseId}}</div>"},
                    {field: 'd.classDetail.courseName', title: '课程名称', fixed: 'left',templet: "<div>{{d.classDetail.courseName}}</div>"},
                    {field: 'd.classDetail.stmanName', title: '建课老师', fixed: 'left',templet: "<div>{{d.classDetail.stmanName}}</div>"},
                    {fixed: 'right', title: '操作', width: 120, toolbar: '#barDemo'}
                ]
            ],
            where:{
                stmanAcademy : "材料科学与工程学院"
            }
        });

        table.on('tool(test)', function (obj) {
            var Data = obj.data;
            if(obj.event === 'detail'){
                location.href='/sourceDetailJump/'+Data.classDetail.courseId;
            }
        })
    })

</script>
</html>